<!DOCTYPE html><head>
	<meta charset="utf-8">
	<title>Portfolio List - Fashionic Ajax Respondsive HTML Template - Live Preview</title>
	<!--DIRECTION-AWARE HOVER EFFECT on Gallery blcok-->
	
	<!-- CSS
	  ================================================== -->
	<link rel="stylesheet" media="all" type="text/css" href="styles/mediaelementplayer.min.css" />
	<link rel="stylesheet" media="all" type="text/css" href="styles/supersized.css" />
	<link rel="stylesheet" media="all" type="text/css" href="js/themes/classic/galleria.classic.css" />
	<link rel="stylesheet" media="all" type="text/css" href="style.css" />
	<link rel="stylesheet" media="all" type="text/css" href="styles/light.css" /><!--Color scheme include: light.css and dark.css-->
	<link rel="stylesheet" media="all" type="text/css" href="styles/respondsive.css" />
	<link rel="stylesheet" media="only screen and (-webkit-min-device-pixel-ratio: 2)" type="text/css" href="styles/retina.css" />
	
	<noscript><style>.da-thumbs .gallerylayout a div {top: 0px;left: -100%;-webkit-transition: all 0.3s ease;moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}.da-thumbs .gallerylayout a:hover div{left: 0px;}</style></noscript><!--HOVER EFFECT For gallery block in lis tpage -->

	 <!--Mobile Specific Metas
	  ================================================== -->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	
	<!-- JS
 	================================================== -->
	<script type='text/javascript' src='js/jquery.js'></script>
	<script type='text/javascript' src='js/jquery.easing.min.js'></script>
	<script type='text/javascript' src='js/jquery.infinitescroll.min.js'></script>
	<script type='text/javascript' src='js/mediaelement-and-player.min.js'></script>
	<script type='text/javascript' src='js/jquery.hoverIntent.js'></script>
	<script type='text/javascript' src='js/supersized.3.2.7.min.js'></script>
	<script type='text/javascript' src='js/supersized.shutter.min.js'></script>
	<script type='text/javascript' src='js/galleria-1.2.8.min.js'></script>
	<script type='text/javascript' src='js/themes/classic/galleria.classic.js'></script>
	<script type='text/javascript' src='js/jquery.hoverdir.js'></script>
	<script type='text/javascript' src='js/color.js'></script>
	<script type='text/javascript' src='js/jquery.isotope.js'></script>
	<script type='text/javascript' src='js/main.js'></script>
	<script>
	var blockWidth = '320'; // Width of block
	var blockMargin = '0';  // Space between blocks
	var blockColumn = '2';  // Columns of expanded block 
	var smallBlockBg = '#ffffff'; // Background color of block
	var bigBlockBg = '#f3f3f3'; // Background color of expanded block
	</script>
	
	
	<!-- Favicons
	================================================== -->
	<link rel="shortcut icon" href="img/favicon.ico">
	<link rel="apple-touch-icon-precomposed" href="img/apple-touch-icon-114x114.png">
	
	<!-- IE hack
	================================================== -->
	<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->
	
	<!--[if lte IE 8 ]>
	<script type="text/javascript" src="js/ie.js"></script>
	<link rel="stylesheet" media="all" type="text/css" href="styles/ie.css" />
	<![endif]-->
	
	<!--[if lte IE 6]>
	<div style="width: 100%;" class="messagebox_orange">Your browser is obsolete and does not support this webpage. Please use newer version of your browser or visit <a href="http://www.ie6countdown.com/" target="_new">Internet Explorer 6 countdown page</a>  for more information. </div>
	<![endif]-->	
	
	<!--/////////////
	//Google Fonts//
	///////////////-->
	<link href='../../../fonts.googleapis.com/css_362961CB' rel='stylesheet' type='text/css'>
	<link href='../../../fonts.googleapis.com/css_D6542681' rel='stylesheet' type='text/css'>
	<link href='../../../fonts.googleapis.com/css_96849461' rel='stylesheet' type='text/css'>
	
</head>

<body class="page">
<div id="wrap">

<!--/////////////////////////////////////////////
//////////                         /////////////
//////////    Left Sidebar Area   //////////////
/////////                         /////////////
////////////////////////////////////////////-->	
	<div id="siderbar" class="sidebar_forlist">
	<div class="sidebar_wrapmost">
	
	<!--
	////////////////
	     Logo
	///////////////
	-->	
		<p id="logo"><a href="index.html" title="Fashionic Template"><img src="img/logo.png" alt="Fashionic Template" width="250" height="90"></a></p>
		<p id="logo_retina"><a href="index.html" title="Fashionic Template"><img src="img/logo_retina.png" alt="Fashionic Template" width="250" height="90"></a></p><!--Logo For High Resolution -->
				
			
	<!--
	//////
	 Menu
	//////
	-->	
		<div class="menu_wrap">
			<div id="navi" class="clearfix">
			<ul class="menu">
				<li class="menu-item"><a href="index.html">HOME</a></li>
				<li class="menu-item current-menu-parent">
					<a href="index.html">PORTFOLIO</a>
					<!--Submenu for Portfolio item-->
					<ul class="sub-menu">
						<li class="menu-item"><a href="portfolio_list_23.html">Portfolio 2:3</a></li>
						<li class="menu-item"><a href="portfolio_list_32.html">Portfolio 3:2</a></li>
						<li class="menu-item"><a href="portfolio_list_11.html">Portfolio 1:1</a></li>
						<li class="menu-item current-menu-item"><a href="portfolio_list_tumblr.html">Tumblr Style</a></li>
					</ul>
					<!--End Submenu for Portfolio item-->
				</li>
				<li class="menu-item">
					<a href="magazine.html">MAGAZINE</a>
					<ul class="sub-menu">
						<li class="menu-item"><a href="magazine_with_slider.html">Magazine with Slider</a></li>
						<li class="menu-item"><a href="magazine_with_border.html">List with Border</a></li>
					</ul>
				</li>
				<li class="menu-item">
					<a href="javascript:;">FEATURES</a>
					<!--Submenu for Features item-->
					<ul class="sub-menu">
						
						<li class="menu-item"><a href="feature_list_style.html">List Page Style</a></li>
						<li class="menu-item"><a href="feature_slider.html">Slider</a></li>
						<li class="menu-item"><a href="feature_pagination.html">Pagination</a></li>
					</ul>
					<!--End Submenu for Features item-->
				</li>
				<li class="menu-item"><a href="javascript:;">PAGE EXAMPLES</a>
					<ul class="sub-menu">
						<li class="menu-item"><a href="about.html">About</a></li>
						<li class="menu-item"><a href="contact.html">Contact</a></li>
					</ul>
				</li>
			</ul>
			</div><!--End navi-->
		</div><!--End menu_wrap-->
	</div><!--End sidebar_wrapmost-->
	
	<div id="siderbar_bottom">
	
	<!--
	//////////////
	Search box
	/////////////
	-->	
		<div id="search" class="searchcss social_active">
			<form id="search_form" name="" method="get" class="search-form_header" action="#">
			<span class="searchicon"></span><input type="text" onBlur="if (this.value == '') {this.value = 'Search';}" onFocus="if (this.value == 'Search') {this.value = '';}" id="s" name="s" value="Search" class="textboxsearch"><input type="submit" value="" class="submitsearch" name="submitsearch">
</form>
		</div><!--END search-->
		
	<!--
	///////////
	Social icons 
	(it is not displayed in mobile device)
	///////////
	-->	
		
		<div id="social_icon">
			<a id="social_facebook" class="social_active" href="../../../www.facebook.com/uiueux/index.htm" title="Visit Facebook page"><span></span></a><!--Facebook-->
			<a id="social_twitter" class="social_active" href="../../../www.twitter.com/uiueux/index.htm" title="Visit Twitter page"><span></span></a><!--Twitter-->
			<a id="social_google_plus" class="social_active" href="#" title="Visit Google Plus page"><span></span></a><!--Google plus-->
			<a id="social_pinterest" class="social_active" href="#" title="Visit Pinterest page"><span></span></a><!--Pinterest-->
			<a id="social_dribbble" class="social_active" href="#" title="Visit Dribbble page"><span></span></a><!--Dribbble-->	
			<!--<a id="social_trumblr" class="social_active" href="#" title="Visit Tumblr page"><span></span></a> Trumblr-->
			<!--<a id="social_youtube" class="social_active" href="#" title="Visit Youtube page"><span></span></a> Youtube-->
			<!--<a id="social_flickr" class="social_active" href="#" title="Visit Flickr page"><span></span></a> Flickr-->
			<!--<a id="social_vimeo" class="social_active" href="#" title="Visit Vimeo page"><span></span></a> Vimeo-->
			<!--<a id="social_linkedin" class="social_active" href="#" title="Visit LinkedIn page"><span></span></a> Linkedin-->
			<!--<a id="social_forst" class="social_active" href="#" title="Visit Forst page"><span></span></a> Forst-->
			<!--<a id="social_github" class="social_active" href="#" title="Visit Github page"><span></span></a> Github-->
			<!--<a id="social_rss" class="social_active" href="#" title="Rss"><span></span></a> Rss-->			
		</div><!--END social_icon-->
		
	
	<!--
	///////////
	copyright 
	(it is not displayed in mobile device)
	///////////
	-->			
		<div id="copyright">Copyright @ uiueux.com</div>
	</div><!--END siderbar_bottom-->	
	</div><!--End sidebar-->



	<!---/////////////////////////////////////////////
	//////////                         /////////////
	//////////    Main Content Area   //////////////
	/////////                         /////////////
	////////////////////////////////////////////-->	
	<div id="content">
	<!--
	////////////////
	  Blocks list
	///////////////
	-->	
	<ul id="item-wrap" class="clearfix">
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; 0 Mid turpis parturient mus aenean" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; 0 Mid turpis parturient mus aenean" src="img/demo/thumb01.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; 0 Mid turpis parturient mus aenean</h2></span>			
				</div>
				</a>
			</div>	
	  	</li><!-- GALLERY block -->	
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; 1 Natoque massa augue eros auctor" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; 1 Natoque massa augue eros auctor" src="img/demo/thumb02.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; 1 Natoque massa augue eros auctor</h2></span>			
				</div>
				</a>
			</div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post eros" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; 2 Auctor et odio natoque massa augue eros" src="img/demo/thumb03.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; 2 Auctor et odio natoque massa augue eros</h2></span>			
				</div>
				</a>
			</div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; 3 Lundium eros in Adipiscing pellentesque" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; 3 Lundium eros in Adipiscing pellentesque" src="img/demo/thumb04.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; 3 Lundium eros in Adipiscing pellentesque</h2></span>			
				</div>
				</a>
			</div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; 3 Pellentesque lundium eros in Adipiscing" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; 3 Pellentesque lundium eros in Adipiscing" src="img/demo/thumb05.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; 3 Pellentesque lundium eros in Adipiscing</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; 4 Non, pulvinar, tincidunt natoque" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; 4 Non, pulvinar, tincidunt natoque" src="img/demo/thumb06.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; 4 Non, pulvinar, tincidunt natoque</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; Augue, velit mus est! Ridiculus" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; Augue, velit mus est! Ridiculus" src="img/demo/thumb07.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; Augue, velit mus est! Ridiculus</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="GALLERY POST &#8211; DIGNISSIM SIT RIDICULUS PENATIBUS" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="GALLERY POST &#8211; DIGNISSIM SIT RIDICULUS PENATIBUS" src="img/demo/thumb08.jpg"/>
				<div><span class="da-thumbs-con"><h2>GALLERY POST &#8211; DIGNISSIM SIT RIDICULUS PENATIBUS</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; Magna, mid turpis parturient mus aenean" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; Magna, mid turpis parturient mus aenean" src="img/demo/thumb09.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; Magna, mid turpis parturient mus aenean</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; Nec integer nisi nascetur tincidunt" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; Nec integer nisi nascetur tincidunt" src="img/demo/thumb10.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; Nec integer nisi nascetur tincidunt</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post &#8211; Quis ut eu, lorem, duis amet pulvinar proin aliquam." class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post &#8211; Quis ut eu, lorem, duis amet pulvinar proin aliquam." src="img/demo/thumb11.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post &#8211; Quis ut eu, lorem, duis amet pulvinar proin aliquam.</h2></span>			
				</div>
				</a></div>	
	  	</li>
			
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post – 1 Product Design" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post – 1 Product Design" src="img/demo/thumb12.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post – 1 Product Design</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post – 2 Etiam sed odio, parturient sagittis porta mid" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post – 2 Etiam sed odio, parturient sagittis porta mid" src="img/demo/thumb13.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post – 2 Etiam sed odio, parturient sagittis porta mid</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post – Dignissim " class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post – Dignissim"  src="img/demo/thumb04.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post – Dignissim</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post – Photography 01" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post – Photography 01" src="img/demo/thumb03.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post – Photography 01</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-1.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post – Photography 03" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post – Photography 03" src="img/demo/thumb02.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post – Photography 03</h2></span>			
				</div>
				</a></div>	
	  	</li>
				
		<li class="item da-thumbs imageblock haslink portfolio" rel="content-gallery-2.html">
			<div class="gallerylayout"><a href="javascript:;" act="zoom" title="Gallery Post – Photography 05" class="thumbwrap">
				<p class="da-mask"></p>
				<img class="thumb" alt="Gallery Post – Photography 05" src="img/demo/thumb01.jpg"/>
				<div><span class="da-thumbs-con"><h2>Gallery Post – Photography 05</h2></span>			
				</div>
				</a></div>	
	  	</li>
	</ul>
	
		
	</div><!--END content -->
	
		<!--//////////////////////////////////
		//// Social icons for mobile devices //
		//////////////////////////////-/////-->
		
		<div id="social_icon" class="social_icon_mobile">
			<a id="social_facebook" class="social_active" href="../../../www.facebook.com/uiueux/index.htm" title="Visit Facebook page"><span></span></a><!--Facebook-->
			<a id="social_twitter" class="social_active" href="../../../www.twitter.com/uiueux/index.htm" title="Visit Twitter page"><span></span></a><!--Twitter-->
			<a id="social_google_plus" class="social_active" href="#" title="Visit Google Plus page"><span></span></a><!--Google plus-->
			<a id="social_pinterest" class="social_active" href="#" title="Visit Pinterest page"><span></span></a><!--Pinterest-->
			<a id="social_dribbble" class="social_active" href="#" title="Visit Dribbble page"><span></span></a><!--Dribbble-->	
			<!--<a id="social_trumblr" class="social_active" href="#" title="Visit Tumblr page"><span></span></a> Trumblr-->
			<!--<a id="social_youtube" class="social_active" href="#" title="Visit Youtube page"><span></span></a> Youtube-->
			<!--<a id="social_flickr" class="social_active" href="#" title="Visit Flickr page"><span></span></a> Flickr-->
			<!--<a id="social_vimeo" class="social_active" href="#" title="Visit Vimeo page"><span></span></a> Vimeo-->
			<!--<a id="social_linkedin" class="social_active" href="#" title="Visit LinkedIn page"><span></span></a> Linkedin-->
			<!--<a id="social_forst" class="social_active" href="#" title="Visit Forst page"><span></span></a> Forst-->
			<!--<a id="social_github" class="social_active" href="#" title="Visit Github page"><span></span></a> Github-->
			<!--<a id="social_rss" class="social_active" href="#" title="Rss"><span></span></a> Rss-->	
		</div><!--END social-->
		
		<!--//////////////////////////////////////
		//// Copyright info. for mobile devices //
		//////////////////////////////-/////-->
		<div id="copyright_mobile" style="">Copyright @ uiueux.com</div>
</div>
<!--Back Top button-->
<div id="top"></div>
</body>
</html>